import React, { forwardRef, useEffect, useState } from 'react'
import { Select } from "antd";
import { getAllWarehouseSelection } from "@sagas/warehouse/warehouseManagement";
import { useSelector, useDispatch } from "react-redux";

export const AllWarehouseSelect = props => {
    const { value, onChange, width, showAll } = props
    const [id, setId] = useState(value)
    const dispatch = useDispatch()
    const { allWarehouseSelection } = useSelector(state => state.warehouseManagement)

    useEffect(() => {
        dispatch(getAllWarehouseSelection())
    }, [])

    const handleValueChange = value => {
        setId(value)
        onChange(value)
    }

    return (
        <>
            <Select
                style={{ width: width || '140px' }}
                value={id}
                onChange={handleValueChange}
            >
                { showAll ? <Select.Option key="default" value="">全部仓库</Select.Option> : null}
                {allWarehouseSelection.map(warehouse => (
                    <Select.Option key={warehouse.id} value={warehouse.id}>{warehouse.name}</Select.Option>
                ))}
            </Select>
        </>
    )
}